﻿$(document).ready(function() {
    $('.feed-input').each(function () {
        var type = $(this).attr('type');
        var interval = Number($(this).attr('interval'));
        var targetId = $(this).attr('targetId');

        // TODO: when user handling works, change this real authentication mechanism
        var userId = $(this).attr('userId');
        var opts = { 
            type: type, 
            interval: interval, 
            targetId: targetId,
            userId: userId
        };
        initializeFeedInput(opts, $(this));
    });
});

// creates control to add new updates 
function createAddUpdateControl($feedInput, opts) {
    var $sendMessageContainer = $('<div id="sendMessageContainer"><input type="text" name="message" /><input type="submit" value="Share" /></div>');
    $feedInput.append($sendMessageContainer);
    $feedInput.find('input[type="submit"]').bind('click', function () { addUpdate(opts, $feedInput) });
}

function initializeFeedInput(opts, $feedInput) {
    // sanity check
    if(opts.interval < 5000)
        opts.interval = 5000;

    createAddUpdateControl($feedInput, opts);
    $feedInput.attr('timestamp', 0);
    setInterval(function () { updateFeedInput(opts, $feedInput); }, opts.interval);
}

// gets latest feeds
function updateFeedInput(opts, $feedInput) {
    // number returns 0 if undefined
    var previousTimestamp = Number($feedInput.attr('timestamp'));

    // TODO: check from the opts which kind of feed was requested

    $.get(
        '/Feed/GetProjectFeed',
        {
            projectId: opts.targetId,
            userId: opts.userId,
            timestamp: previousTimestamp
        },
        function (result) {
            updateFeedInputCallback(result, $feedInput); 
        },
        'json'
    );    
}

// adds update to the 
function addUpdate(opts, $feedInput) {
    var $sendMessageContainer = $feedInput.find('#sendMessageContainer');
    var $input = $sendMessageContainer.find('input[type=text]');
    $.post(
        '/Feed/AddProjectUpdate',
        {
            projectId: opts.targetId,
            userId: opts.userId,
            updateText: $input.val()
        },
        function (result) {
            //updateFeedInputCallback(result, $feedInput);
        },
        'json'
    );
}

function updateFeedInputCallback(result, $feedInput) {
    if (result.isAppend == false) {
        $feedInput.remove('.updateItem');
    }
    var sendMessageContainer = $feedInput.find('#sendMessageContainer')
    for(var i = 0 ; i < result.updates.length ; i++) {
        var update = result.updates[i];
        // get latest timestamp
        if (i <= 0) {
            $feedInput.attr('timestamp', update.Timestamp);
        }

        // TODO: put visual stuff to the CSS
        var $updateItem = $('<div class="updateItem" style="display: none;" timestamp="' + update.Timestamp + '"><span style="font-weight: bold;">' + update.Name + '</span> ' + update.Text + ' (' + update.DisplaybleTime + ')</div>');
        $updateItem.insertAfter(sendMessageContainer);        
        $updateItem.show('fade');
    }
}